<template>
	<view class="ne_user">
		<view class="ne_user_top">
			<view class="ne_top_info">
				<image class="ne_top_img" src="https://community.chuangxiangdianli.com/images/neighborimg/user.png" mode=""></image>
				<text>孙正普</text>
			</view>
		</view>
		
		<view class="ne_user_con">
			<view class="con_nav">
				<text class="con_nav_item" :class="currNeNavIndex == 1?'con_curr_item':''" @click="changeNeNav(1)">出租发布 </text>
				<text class="con_nav_item" :class="currNeNavIndex == 2?'con_curr_item':''" @click="changeNeNav(2)">出售发布 </text>
			</view>
			<scroll-view class="house_list" scroll-y @scrolltolower="scrolltolower">
				<view class="house_li_item" v-for="(item,index) in houseInfoList" :key="item.id">
					<image class="li_item_fl" :src="item.image" mode=""></image>
					<view class="li_item_fr">
						<text class="fr_top">{{item.title}}</text>
						<view class="fr_label"> 
							<text>{{item.community.community_name}}</text>
							<text>{{item.house_type}}</text>
							<text></text>
						</view>
<!-- 						<view class="fr_tag">
							<u-tag  class="u-tag" :text="123" type="primary" size="mini" mode="plain" />
						</view> -->
						<text class="price">{{item.money}} 元<text v-if="currNeNavIndex==1">/月</text></text>
					</view>
					<view class="ne_edit">
						<text class="ne_edit_c" @click="gochange(item)">编辑</text>
						<text class="ne_delete" @click="deleteLease(index,item.id)">删除</text>
					</view>
				</view>
			</scroll-view>
		</view>
		<!-- tab -->
		<NeighborTab></NeighborTab>
	</view>
</template>

<script>
	import NeighborTab from '../common/neighborTab.vue'
	export default {
		components:{
			NeighborTab 
		},
		data() {
			return {
				currNeNavIndex: 1,
				// 出租房屋列表
				houseInfoList: [], 
				page: 1,
				// 每页默认条数
				limit: 10,
				showGetHouse: true,
			};
		},
		onShow() {
			// this.getRentalList()
			this.changeNeNav(1)
		},
		watch: {
			page(newNum) {
				if (this.currNeNavIndex == 1) {
					this.showGetHouse && this.getLease()
				} else {
					this.showGetHouse && this.getbuyhouse()
				}
			},
		},
		methods:{
			gochange(item){
				if(this.currNeNavIndex == 1){
					uni.navigateTo({
						url:"/neighbor/leasehouse/index?id="+item.id
					})
				}else{
					uni.navigateTo({
						url:"/neighbor/housesell/index?id="+item.id
					})
				}
			},
			changeNeNav(index){
				this.currNeNavIndex = index
				this.houseInfoList = []
				if(this.currNeNavIndex==1){
					this.getLease()
				}else{
					this.getbuyhouse()
				}
			},
			getbuyhouse() {
				let data = {
					page: this.page,
					limit: this.limit,
					type:'my'
				}
				this.$http.get('Mini/circle/house/sell', data).then(res => {
					if (res.code == 200) {
						this.houseInfoList.push(...res.data.data)
						this.showGetHouse = res.data.data.length >= this.limit
					}
				})
			},
			getLease() {
				let data = {
					page: this.page,
					limit: this.limit,
					type:'my'
				}
				this.$http.get('Mini/circle/house/lease', data).then(res => { 
						
						if (res.code == 200) {
							this.houseInfoList.push(...res.data.data)
							this.showGetHouse = res.data.data.length >= this.limit
						}
					}) 
			},
			// 获取下一页数据
			scrolltolower() {
				this.page += 1
			// }
			},
			// 获取房屋出租列表
			 getRentalList(){
				this.$http.get('Mini/circle/house/lease').then(res => { 
					if(res.code == 200){
						this.rentalList = res.data
					}
				})
			 },
			// 删除房屋列表
			deleteLease(n,id){ 
				uni.showModal({
				    title: '提示',
				    content: '确认删除这条发布信息吗',
				    success: (res) =>{
				        if (res.confirm) {
				           if(this.currNeNavIndex==1){
							   this.$mrequest2({
							   	url:'Mini/circle/house/lease/'+id,
							   	method:'DELETE'
							   }
							   ).then((res)=>{
								   if(res.code == 200){
								   	uni.showToast({
								   		title: '删除成功',
								   		icon: 'none',
										success: () => {
											this.houseInfoList.splice(n,1) 
										}
								   	})
									
								   	// this.getRentalList()
								   }
							   
							   })
						   }else{
							   this.$mrequest2({
							   	url:'Mini/circle/house/sell/'+id,
							   	method:'DELETE'
							   }
							   ).then((res)=>{
							   			if(res.code == 200){
							   				uni.showToast({
							   					title: '删除成功',
							   					icon: 'none',
											success: () => {
												this.houseInfoList.splice(n,1) 
											}
													})
											
							   				// this.getRentalList()
							   			}
							   
							   })
						   }
				        } else if (res.cancel) {
				            console.log('用户点击取消');
				        }
				    }
				});

			}
		},
		}
	
</script>

<style lang="scss">
	.ne_user{
		.ne_user_top{
			position: relative;
			height: 407rpx;
			background-color: #ff7430;
			.ne_top_info{
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				position: absolute;
				left: 50%;
				top: 50%;
				transform: translate(-50%,-50%);
				width: 120rpx;
				height: 180rpx;
				font-size: 34rpx;
				text-align: center;
				color: #fff; 
				.ne_top_img{
					width: 120rpx;
					height: 120rpx;
				}
			}
		}
		.ne_user_con{
			position: relative;
			top: -30rpx;
			height: 1000rpx;
			border-radius: 30rpx;
			background-color: #fff;
			.con_nav{
				display: flex;
				justify-content: space-around;
				height: 121rpx;
				line-height: 121rpx;
				border-bottom: 2rpx solid #c3c3c3;
				.con_nav_item{
					font-size: 32rpx;
					font-weight: 700;
				}
				.con_curr_item{
					color: #ff7430;
					border-bottom: 4rpx solid #ff7430;
				}
			}
			.house_list {
				padding: 0 20rpx;
				height: calc(100vh - 640rpx);
				background-color: #fff;
				.house_li_item {
					position: relative;
					display: flex;
					justify-content: space-between;
					width: 94vw;
					padding: 38rpx 0;
					height: 366rpx;
					border-bottom: 1rpx solid #f5f5f5;
			
					.li_item_fl {
						width: 242rpx;
						height: 210rpx;
						border-radius: 10rpx;
						background-color: #c3c3c3;
					}
			
					.li_item_fr {
						width: 413rpx;
						overflow: hidden;
						text-overflow: ellipsis;
						white-space: nowrap;
			
						.fr_top {
							font-weight: 700;
							font-size: 32rpx;
						}
			
						.fr_label {
							display: flex;
							justify-content: space-between;
							height: 64rpx;
							line-height: 64rpx;
						}
			
						.fr_tag {
							height: 64rpx;
			
							.u-tag {
								margin-right: 10rpx;
							}
						}
			
						.price {
							font-size: 38rpx;
							color: #FF6716;
							font-weight: 700;
						}
					} 
					.ne_edit{
						position: absolute;
						width: 100%;
						text-align: right;
						bottom: 20rpx;
						height: 68rpx;  
						.ne_edit_c,
						.ne_delete {
							margin-right: 18rpx;
							display: inline-block;
							width: 156rpx;
							height: 67rpx;
							line-height: 67rpx;
							text-align: center;
							font-size: 30rpx;
							color: #717171;
							background: #FFFFFF;
							border: 2rpx solid #C6C6C6;
							border-radius: 10rpx;

						}
						.ne_delete{
							color: #fff;
							background-color: #c3c3c3;
						}
					}
				}
			}
		}
	}
</style>
